<style lang="less">
@import "./login.less";
</style>

<template>
  <div class="login">
    <div class="login-con">
      <Card
        icon="log-in"
        title="欢迎登录"
        :bordered="false"
      >
        <div class="form-con">
          <login-form @on-success-valid="handleSubmit"></login-form>
          <p class="login-tip">请输入用户名密码</p>
        </div>
      </Card>
    </div>
  </div>
</template>

<script>
import LoginForm from "_c/login-form";
import authRouter from "@/router/authRouters";
import funcRouter from "@/router/funcRouter";
import { mapMutations, mapActions } from "vuex";
import { getMenuNav } from "@/api/system";
import { recursionRouter } from "@/libs/util";
export default {
  components: {
    LoginForm
  },
  methods: {
    ...mapMutations(["updateMenuList", "getUserInfo"]),
    ...mapActions(["handleLogin", ""]),
    handleSubmit({ username, password, captcha }) {
      //清空localStorage
      localStorage.clear();
      this.handleLogin({ username, password, captcha }).then(res => {
        sessionStorage.setItem("loginName",username)
        this.getMenuNav();
      });
    },
    async getMenuNav() {
      let res = await getMenuNav();
      console.log(res);
      if (res.code == 0) {
        this.getUserInfo(res);
        //存储按钮权限
        sessionStorage.setItem("permissions", JSON.stringify(res.permissions));
        //添加路由
        let realRoutes = recursionRouter(authRouter, res.menu);
        this.$router.addRoutes(realRoutes);
        this.$router.addRoutes(funcRouter);
        //添加左边的菜单
        this.updateMenuList(realRoutes);
        this.$router.push({
          name: this.$config.homeName
        });
      }
    }
  }
};
</script>

<style>
</style>
